<template>
  <div class="con">
    <el-page-header content="会议管理" title="首页" @back="goBack" />
    <div class="card-header">会议管理</div>
    <div class="action">
      <el-button type="primary">创建会议</el-button>
      <el-button type="primary">加入会议</el-button>
    </div>

    <div class="title"><span>即将开始的会议</span></div>
    <div class="table">
    <el-table :data="tableDate"  border stripe style="width: 100%">
      <el-table-column prop="date" label="#" width="60" />
      <el-table-column prop="date" label="会议名称" width="150" />
      <el-table-column prop="date" label="会议开始时间" width="150" />
      <el-table-column prop="name" label="会议结束时间" width="150" />
      <el-table-column prop="name" label="会议秘钥" width="120" />
      <el-table-column prop="name" label="会议状态" width="100" />
      <el-table-column prop="title" label="人员签到情况" width="150" />
      <el-table-column prop="title" label="操作" />
    </el-table>
    </div>

    <div class="title"><span>我参加的会议</span></div>
    <div class="table">
    <el-table :data="allMetting" border stripe style="width: 100%">
      <el-table-column prop="date" label="#" width="60" />
      <el-table-column prop="mname" label="会议名称" width="150" />
      <el-table-column prop="mstart" label="会议开始时间" width="150" />
      <el-table-column prop="muname" label="会议创建人" width="150" />
      <el-table-column prop="isend" label="会议状态" width="100" />
      <el-table-column prop="name" label="个人签到情况" width="150" />
      <el-table-column prop="title" label="操作" />
    </el-table>
    </div>

  </div>
</template>

<script setup>
import axios from 'axios';
import { reactive } from 'vue';
import router from '../router';

const goBack=()=>{
  router.push('/home')
}

let allMetting=reactive([
  {
            "id": 1,
            "mname": "chenlh创建的会议",
            "muname": "chenlh",
            "mkey": "asdf",
            "mstart": "2022-05-30 15:00",
            "mend": "2022-05-30 18:00",
            "isend": "true"
        },
        {
            "id": 2,
            "mname": "chenh创建的会议",
            "muname": "chenlh",
            "mkey": "qazs",
            "mstart": "2022-5-10 10:30 ",
            "mend": "2022-5-10 18:30",
            "isend": "false"
        }
])


</script>

<style scoped>
.con {
  width: 100%;
}
.button {
  margin-left: 30px;
}
.card-header {
  font-weight: 600;
  margin: 10px;
  font-size: 30px;
}
span {
  margin: 10px;
}
.action{
    margin-left: 70%;
}
.table{
    width: 95%;
    border: 1px solid rgba(0,0,0,0.5);
    border-radius: 10px;
    margin: 10px;
    box-shadow: 1px 1px 5px 1px rgba(0, 0, 0, 0.6);
}

</style>